<template>
	<view>
		<view class="outbox" @click="open(id)">
			<image class="img1" mode="aspectFit" :src="url"></image>
			<text>{{coursename}}</text>
			<view class="momey">
				<image class="img2" src="https://cimg.axureshop.com/47/f6/19/47f6193bc5004b1388c6fa23d2a9bd4e/images/%E9%A6%96%E9%A1%B5/u120.png"></image>
				<text>{{courseprice}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		name:'Teacher',
		props:{
			coursename:String,
			url:String,
			courseprice:Number,
			id:Number
		},
		methods:{
			open(id){
				uni.redirectTo({
					url:`/pages/courseDetail/courseDetail?id=${id}`
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.outbox{
		width: 300rpx;
		height: 348rpx;
		// background-color: green;
		display: flex;
		flex-direction: column;
	}
	.outbox>text{
		font-size: 28rpx;
		color: gray;
		margin-bottom: 20rpx;
	}
	.momey{
		display: flex;
		align-items: center;
	}
	.momey>text{
		font-size: 26rpx;
		font-weight: 600;
	}
	.img1{
		width: 300rpx;
		height: 200rpx;
		margin-bottom: 20rpx;
	}
	
	.momey>.img2{
		width: 34rpx;
		height: 34rpx;
		margin-right: 10rpx;
	}
</style>